﻿<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>首页导航</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css">
		<!-- 自定义的CSS文件 -->
		<link rel="stylesheet" href="css/nav.css"/>
		<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
		<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
		<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
		<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" ></script>
	</head>
	<script>
//		$(window).scroll(function(){
//			var offtop=$(window).scrollTop();
//			if(offtop>=11)
//			{
//				$("header").addClass("scroll");
//			}
//			else{
//				$("header").removeClass("scroll");
//			}
//		})
	</script>
	<body>
		<header>
			<nav class="navbar navbar-inverse">
				<div class="container-fluid">
					<div class="navbar-header">
					  <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#menu" aria-expanded="false">
						<span class="sr-only">Toggle navigation</span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					  </button>
					  <a class="navbar-brand" href="#">飞海</a>
					</div>
					<div class="collapse navbar-collapse" id="menu">
					  <ul class="nav navbar-nav">
						<li><a href="#">广场</a></li>
						<li><a href="#">关注</a></li>
						<li><a href="#">热榜</a></li>
					  </ul>
					  <form class="navbar-form navbar-left">
						  <input type="text" class="form-control" placeholder="Search">
						  <button class="search" type="submit" class="btn btn-default">
							  <span class="glyphicon glyphicon-search" aria-hidden="true" role="button"></span>
						  </button>			
					  </form>
					  <ul class="nav navbar-nav navbar-right">
						<li><a href="#"><span class="glyphicon glyphicon-pencil"></span>写博客</a></li>
						<li class="dropdown">
						  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">我的
							<span class="caret"></span>
						  </a>
						  <ul class="dropdown-menu">
							<li><a href="#">登录</a></li>
							<li><a href="#">注册</a></li>
							<!-- <li role="separator" class="divider"></li> -->
						  </ul>
						</li>
					  </ul>
					</div>
				</div>
			</nav>
		</header>
		<!--<div style="height: 800px;"></div>-->
	</body>
</html>
